<template>
  <div class="son">
    <h3>这是son.vue</h3>
    <!-- 下面一点击就会报错，而且也不会流入到父 -->
    <button @click="mother = '林允儿'">修改mother</button>
    <button @click="fn">通知父组件修改money</button>
    <!-- 如果只有1句话也可以写到行内 -->
    <button @click="$emit('changemoney', 4999)">修改父</button>
    <button @click="obj.name = 'rose'">修改obj.name</button>

    <!-- 下面这句代码要报错 -->
    <button @click="obj = { name:'andy', age: 19 }">修改obj的指向</button>
    <p>父传递过来：{{ mother }} -- {{ money }}</p>
    <p>{{ obj }}</p>
  </div>
</template>

<script>
export default {
  // 问父组件要一个数据，数据叫mother
  // 还要了一个数据叫money
  props: ["mother", "money", "obj"],

  methods: {
      fn () {
         // 通知父去修改money $emit('自定义的事件名', 要给父的数据)
         this.$emit('changemoney', 1299)
      }
  }
};
</script>

<style>
.son {
  width: 350px;
  height: 350px;
  border: 1px solid #000;
}
</style>